<template>
	<app-page>
		<wd-config-provider :theme="theme">
			<view class="container">
				<!--  -->
				<wd-tabs :sticky="true" lineWidth="60" lineHeight="2" custom-class="wd-tabs-custom-class"
					v-model="currentTab" @change="tabsChange">
					<block v-for="item in tabs" :key="item">
						<wd-tab :title="item">
							<!-- <view class="content">{{ item }}</view> -->
						</wd-tab>
					</block>
				</wd-tabs>
				<view class="list">
					<order-list-item v-for="(item, index) in dataList" :item="item"></order-list-item>
				</view>
			</view>
		</wd-config-provider>
	</app-page>

</template>

<script lang="ts">
	import { defineComponent, ref } from 'vue';

	import useRouter from '@/hooks/useRouter.ts';
	import { onShow } from "@dcloudio/uni-app"
	import useOrder from './useOrder';
	export default defineComponent({
		name: 'Order',
		setup(props, ctx) {
			const order = useOrder();
			const router = useRouter();

			// 日间light、夜间dark主题
			const theme = ref('light');
			const firstLoad = ref(true); // 是否是第一次加载页面数据，用于初始化数据后自动刷新页面数据

			// order.getData()
			onShow(() => {
				const orderType = uni.getStorageSync('order_type')  // 获取缓存的订单类型，默认全部订单all
				if (orderType) {
					order.setParams({
						status: Number(orderType)
					})
					order.currentTab.value = Number(orderType) // 设置当前tab为缓存的订单类型，用于切换tab时自动刷新页面数据
					uni.removeStorageSync("order_type")
				}
				if (firstLoad.value) {
					order.getData()
				} else {
					order.reGetData();
				}
			})
			return {
				theme,
				...order
			};
		}
	});
</script>
<!-- #ifdef MP-WEIXIN -->
<style lang="less">
	page {
		background-color: #f2f2f2;
	}
</style>
<!-- #endif -->
<style lang="less" scoped>
	page {
		background-color: #f2f2f2;
	}

	.container {


		.list {
			padding: 0 24rpx;
			padding-bottom: 27rpx;

		}
	}
</style>